<template>
	<view class="content">
		<view class="title">个人简介</view>
		<textarea v-model="text" placeholder="填写个人简介更容易获得别人关注哦~" placeholder-class="defaultInput" maxlength="200" @input="descInput"/>
		<view class="length">{{remnant}}/200</view>
	</view>
</template>

<script>
	export default{
		data() {
			return {
				text: '',
				remnant: 0
			}
		},
		onLoad(e) {
			this.text = e.text;
		},
		onNavigationBarButtonTap() {
			this.editBrife();
		},
		methods: {
			/* 获取文本域的长度及内容 */
			descInput(e) {
				this.remnant = e.detail.cursor;
				this.text = e.detail.value;
				if (this.remnant >= 200) {
					uni.showToast({
						title: '最多只能输入200个字',
						icon: 'none'
					})
				}
			},
			editBrife() {
				this.$zapi.apiPost('user/video.User/UserHomeEdit',{autograph:this.text}).then(res=>{
					uni.showToast({
						title: res.data.msg,
						icon: 'none'
					})
					setTimeout(function() {
						uni.navigateBack({
							delta: 1
						})
					}, 1000);
				})
			}
		}
	}
</script>

<style>
	page{
		background: #FAFAFA;
	}
	.title{
		color: #999999;
		font-size: 30upx;
		line-height: 1;
		padding: 20upx 30upx;
	}
	textarea{
		background: #FFFFFF;
		width: 690upx;
		padding: 30upx 30upx 50upx;
	}
	.defaultInput{
		color: #CCCCCC;
		font-size: 30upx;
	}
	.length{
		color: #CCCCCC;
		font-size: 26upx;
		position: absolute;
		right: 30upx;
		margin-top: -50upx;
	}
</style>
